import { getConfig } from '../utils'

export const useSettingStore = defineStore('pure-setting', () => {
  // state
  const title = ref(getConfig().Title ?? '')
  const fixedHeader = ref(getConfig().FixedHeader ?? false)
  const hiddenSideBar = ref(getConfig().HiddenSideBar ?? false)

  // getters
  const getTitle = computed(() => title.value)
  const getFixedHeader = computed(() => fixedHeader.value)
  const getHiddenSideBar = computed(() => hiddenSideBar.value)

  // actions
  function CHANGE_SETTING({ key, value }) {
    if (key === 'title') title.value = value
    if (key === 'fixedHeader') fixedHeader.value = value
    if (key === 'hiddenSideBar') hiddenSideBar.value = value
  }

  function changeSetting(data) {
    CHANGE_SETTING(data)
  }

  return {
    title,
    fixedHeader,
    hiddenSideBar,
    getTitle,
    getFixedHeader,
    getHiddenSideBar,
    CHANGE_SETTING,
    changeSetting,
  }
})

export default useSettingStore()
